﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ProjectForm.aspx.cs" Inherits="WebApplication.Admin.ProjectForm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>项目编辑</title>
    <script src="../../scripts/boot.js" type="text/javascript"></script>
    <style type="text/css">
        .form-label
        {
            width: 80px;
        }
    </style>
</head>
<body>
    <div class="mini-fit" id="rootPanel" style="padding: 5px">
        <form id="form1" method="post" runat="server">
        <asp:HiddenField ID="hidID" runat="server" />
        <table class="form-table" border="0" cellpadding="1" cellspacing="2" width="100%">
            <tr>
                <td class="form-label">
                    名称：
                </td>
                <td colspan="3">
                    <input name="Name" class="mini-textbox" vtype="required;maxLength:200" width="100%" />
                </td>
            </tr>
            <tr>
                <td class="form-label">
                    说明：
                </td>
                <td colspan="3">
                    <input name="Description" class="mini-textbox" vtype="maxLength:2000" width="100%" />
                </td>
            </tr>
            <tr>
                <td class="form-label">
                    开始日期：
                </td>
                <td>
                    <input name="BeginDate" class="mini-datepicker" vtype="required" />
                </td>
                <td class="form-label">
                    结束日期：
                </td>
                <td>
                    <input name="EndDate" class="mini-datepicker" vtype="required" />
                </td>
            </tr>
        </table>
        <div style="width: 100%; margin-top: 5px;">
            <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
                <table style="width: 100%;">
                    <tr>
                        <td>
                            项目申报涉及的部门：
                        </td>
                        <td align="right">
                            <a class="mini-button" iconcls="icon-add" onclick="selectArea()" plain="true">添加部门</a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div id="dataGridArea" class="mini-datagrid" style="width: 100%; height: 180px;"
            allowresize="true" allowcelledit="true" allowcellselect="true" multiselect="true"
            showpager="false" allowcellvalid="true" editnextonenterkey="true" editnextrowcell="true"
            idfield="ID" emptytext="数据为空" showemptytext="true">
            <div property="columns">
                <div type="indexcolumn" headeralign="center">
                    序号</div>
                <div type="checkcolumn">
                </div>
                <div field="Name" width="100%" vtype="required;maxLength:50">
                    名称
                </div>
                <div field="Order" width="80" vtype="required;int">
                    排序
                    <input property="editor" class="mini-textbox" />
                </div>
                <div name="edit" field="ID" width="60" align="center" headeralign="center">
                    操作
                </div>
            </div>
        </div>
        <div style="width: 100%; margin-top: 5px;">
            <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
                <table style="width: 100%;">
                    <tr>
                        <td>
                            项目申报需处理的环节：
                        </td>
                        <td align="right">
                            <a class="mini-button" iconcls="icon-add" onclick="selectNode()" plain="true">添加节点</a><span
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div id="dataGridNode" class="mini-datagrid" style="width: 100%; height: auto" allowresize="true"
            allowcelledit="true" allowcellselect="true" multiselect="true" allowcellvalid="true"
            onshowrowdetail="onShowRowDetail" showpager="false" editnextonenterkey="true"
            editnextrowcell="true" idfield="ID" emptytext="数据为空" showemptytext="true">
            <div property="columns">
                <div type="indexcolumn" headeralign="center">
                    序号</div>
                <div type="checkcolumn">
                </div>
                <div type="comboboxcolumn" field="AreaID" width="100" headeralign="center" vtype="required;">
                    部门
                    <input property="editor" id="areaCombobox" textfield="text" valuefield="id" class="mini-combobox"
                        vtype="required;" style="width: 100%;" data="Areas" />
                </div>
                <div field="Content" width="100%" vtype="required;maxLength:50">
                    内容
                </div>
                <div field="BeginDate" width="90" dateFormat="yyyy-MM-dd">
                    开始日期
                    <input property="editor" class="mini-datepicker" />
                </div>
                <div field="EndDate"    width90" dateFormat="yyyy-MM-dd">
                    结束日期
                    <input property="editor" class="mini-datepicker" />
                </div>
                <div field="StandardDays" width="80" vtype="required;int">
                    标准工期(天)
                    <input property="editor" class="mini-textbox" />
                </div>
                <div field="ExpectDays" width="80" vtype="required;int">
                    目标工期(天)
                    <input property="editor" class="mini-textbox" />
                </div>
                <div field="Order" width="30" vtype="required;int">
                    排序
                    <input property="editor" class="mini-textbox" />
                </div>
                <div field="NextNodes" displayfield="NextNodeName" name="NextNodes" width="120" headeralign="left">
                    下一节点
                    <input property="editor" id="nodeLookup" class="mini-lookup" style="width: 100%;"
                        textfield="Content" valuefield="ID" popupwidth="auto" popup="#gridPanel" grid="#nextNodeGrid"
                        multiselect="true" onshowpopup="onShowPopup" />
                </div>
                <div name="edit" field="ID" width="60" align="center" headeralign="center">
                    操作
                </div>
            </div>
        </div>
        <div style="text-align: center; padding: 10px;">
            <a class="mini-button" onclick="SaveData" iconcls="icon-save" style="width: 60px;
                margin-right: 20px;">保存</a> <a class="mini-button" onclick="onCancel" iconcls="icon-cancel"
                    style="width: 60px;">取消</a>
        </div>
        <div id="gridPanel" class="mini-panel" title="选择下一环节" iconcls="icon-add" style="width: 450px;
            height: 250px;" visible="false" showtoolbar="false" showclosebutton="true" showheader="true"
            bodystyle="padding:0" borderstyle="border:0">
            <div id="nextNodeGrid" class="mini-datagrid" style="width: 100%; height: 100%;" borderstyle="border:0"
                showpager="false" url="" onrowdblclick="onNodeGridRowDblclick" idfield="ID">
                <div property="columns">
                    <div type="checkcolumn">
                    </div>
                    <div field="Content" width="120" headeralign="center" allowsort="true">
                        内容</div>
                </div>
            </div>
        </div>
        </form>
    </div>
    
    <script type="text/javascript">
        mini.parse();
        var form = new mini.Form("form1");
        var editMode = false;
        var Areas = null;
        var areaGrid = mini.get("dataGridArea");
        areaGrid.on("drawcell", areaGridDrawCell);
        var nodeGrid = mini.get("dataGridNode");
        nodeGrid.on("drawcell", nodeGridDrawCell);
        nodeGrid.on("cellendedit", nodeGridCellEndEdit);

        function nodeGridCellEndEdit(e) {
            console.log(e);
            if (e.field != "BeginDate") { return; }
            var startDate = new Date();
            startDate.setTime(Date.parse(e.value));
            startDate.setDate(startDate.getDate() + e.record.StandardDays-1);
            e.row.EndDate = startDate;
            nodeGrid.updateRow(e.row);
        }

        function areaGridDrawCell(e) {
            var column = e.column;
            if (column.name == "edit") {
                e.cellStyle = "text-align:center";
                e.cellHtml = '<span class="operationBtn icon-remove" title="删除" onclick="areaGridRemoveRow(' + e.sender.getRow(e.rowIndex)._uid + ')"></span>';
            }
        }

        function nodeGridDrawCell(e) {
            var column = e.column;
            if (column.name == "edit") {
                e.cellStyle = "text-align:center";
                e.cellHtml = '<span class="operationBtn icon-remove" title="删除" onclick="nodeGridRemoveRow(' + e.sender.getRow(e.rowIndex)._uid + ')"></span>';
            }
        }

        function selectArea() {
            mini.open({
                url: "/Business/AreaSelect.aspx?" + new Date().getTime(),
                title: "选择部门", width: 800, height: 640,
                ondestroy: function (action) {
                    if (action == "ok") {
                        var iframe = this.getIFrameEl();
                        var datas = mini.clone(iframe.contentWindow.GetData());
                        //areaGrid.clearRows();
                        Areas = new Array();
                        var length = areaGrid.getData().length;
                        for (var i = 0; i < datas.length; i++) {
                            Areas.push({ id: datas[i].ID, text: datas[i].Name });
                            areaGrid.addRow({ AreaID: datas[i].ID, Name: datas[i].Name, Order: datas.length - i }, length + i);
                        }
                        if (mini.get("areaCombobox")) { mini.get("areaCombobox").setData(Areas); }
                    }
                }
            });
        }

        function selectNode() {
            if ($("#hidID").val() == "00000000-0000-0000-0000-000000000000") {
                mini.alert("请先保存项目数据！"); return;
            }
            var size = GetSize(0.8);
            mini.open({
                url: "/Business/NodeForm.aspx?pid=" + $("#hidID").val(),
                title: "添加节点", width: size.Width, height: size.Height,
                ondestroy: function (action) {
                    if (action == "ok") {
                        var iframe = this.getIFrameEl();
                        var datas = mini.clone(iframe.contentWindow.GetData());
                        //nodeGrid.clearRows();
                        var length = nodeGrid.getData().length;
                        for (var i = 0; i < datas.length; i++) {
                            var data = { ID: newGuid(), NodeID: datas[i].ID, Content: datas[i].Content, Order: length + i, StandardDays: datas[i].StandardDays, BeginDate: new Date() };
                            var rate = 0.5;
                            if (data.StandardDays <= 10) { rate = 0.7; } else if (data.StandardDays <= 30) { rate = 0.6; }
                            data.ExpectDays = Math.round(data.StandardDays * rate);
                            nodeGrid.addRow(data, length + i);
                        }
                        mini.get("areaCombobox").setData(Areas);
                    }
                }
            });
        }

        function areaGridRemoveRow(uid) {
            if (uid != undefined) {
                areaGrid.removeRow(areaGrid.getRowByUID(uid));
            } else {
                var rows = areaGrid.getSelecteds();
                if (rows.length > 0) {
                    areaGrid.removeRows(rows, true);
                }
            }
        }

        function nodeGridRemoveRow(uid) {
            if (uid != undefined) {
                nodeGrid.removeRow(nodeGrid.getRowByUID(uid));
            } else {
                var rows = nodeGrid.getSelecteds();
                if (rows.length > 0) {
                    nodeGrid.removeRows(rows, true);
                }
            }
        }

        function SaveData(callbackMethod) {
            if (!form.validate()) { return; }
            areaGrid.validate();
            if (!areaGrid.isValid()) {
                mini.alert("部门数据有错误，请处理后在保存！"); return;
            }
            nodeGrid.validate();
            if (!nodeGrid.isValid()) {
                mini.alert("节点数据有错误，部门、下一节点等数据没有输入，请处理后再保存！"); return;
            }
            var data = form.getData();
            data.ID = $("#hidID").val();
            var areaData = areaGrid.getChanges();
            var nodeData = nodeGrid.getChanges();
            var json = mini.encode({ Project: data, Areas: areaData, Nodes: nodeData });

            mini.get("rootPanel").loading("保存中，请稍后......");
            $.ajax({
                url: "/Handler.ashx?method=SaveProjectData",
                data: { data: json },
                type: "post",
                success: function (text) {
                    mini.get("rootPanel").unmask();
                    var result = mini.decode(text);
                    if (result.Success) {
                        //CloseWindow("changed");
                        $("#hidID").val(result.ID);
                        nodeGrid.accept();
                        areaGrid.accept();
                        notify("保存成功！", null, null, 1500, "right", "bottom", 180);
                    } else {
                        mini.alert("保存失败：" + result.Message);
                    }
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    mini.alert(jqXHR.responseText);
                    mini.get("rootPanel").unmask();
                }
            });
        }

        function onNodeGridRowDblclick(e) {
            nodeGrid.commitEdit();
        }

        var nextNodeGrid = mini.get("nextNodeGrid");
        function onShowPopup(e) {
            console.log("onShowPopup");
            var datas = nodeGrid.getData();
            var items = new Array();
            var selectedRows = new Array();
            var currentRow = nodeGrid.getSelected();
            $(datas).each(function () {
                if (currentRow.ID != this.ID) {
                    var row = { ID: this.ID, Content: this.Content };
                    items.push(row);
                    if (currentRow.NextNodes && currentRow.NextNodes.indexOf(this.ID) > -1) { selectedRows.push(row); }
                }
            });
            nextNodeGrid.setData(items);
            nextNodeGrid.selects(selectedRows);
        }
    </script>
    <script type="text/javascript">
    var model=<%=ModelJson %>;
    if(model!=null){
        form.setData(model.Project);
        areaGrid.setData(model.Areas);
        nodeGrid.setData(model.Nodes);
        Areas=new Array();
        for(var i=0;i<model.Areas.length;i++){
            Areas.push({id:model.Areas[i].AreaID,text:model.Areas[i].Name});
        }
    }
    </script>
    <script type="text/javascript" des="close&cancel event handler">
        function GetData() {
            var o = form.getData();
            return o;
        }
    </script>
</body>
</html>
